<%--
  Created by IntelliJ IDEA.
  User: gaoran
  Date: 2020/3/25
  Time: 11:43
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport"
      content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="stylesheet" href="../../css/email/m/jquery.mobile.css"/>
<link rel="stylesheet" href="../../lib/mui/mui/mui.min.css"/>

<link rel="stylesheet" href="../../css/email/m/styles.css"/>
<link rel="stylesheet" href="../../css/email/m/style.css">
<link rel="stylesheet" href="../../css/email/m/mail.css">
<script type="text/javascript" src="../../js/jquery/jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="../../js/base/base.js"></script>
<script type="text/javascript" src="../../js/ewx/waterMark.js?20190819.2"></script>
<script type="text/javascript" src="../../lib/mui/mui/mui.min.js"></script>
<script type="text/javascript" src="../../js/diary/m/simbaJs.js"></script>


<link rel="stylesheet" href="../../lib/mui/mui/mui.picker.min.css"/>
<script type="text/javascript" src="../../lib/mui/mui/mui.picker.min.js"></script>

<style>

    .all{
        width: 100%;
        height: 100%;
    }
    .content{
        width: 96%;
        margin: 0 auto;
        border: #BDBDBD solid 1px;
        border-radius: 6px;
    }

    .content .c_title{
        background: #e6e6e6;
        height: 35px;
        line-height: 35px;
        font-size: 18px;
        text-align: center;
    }

    .content .c_con{
        height: 500px;
    }

    .content .c_con ul li{
        border-bottom: #E6E6E6 solid 1px;
        padding: 5px;
        position: relative;
    }

    .content .c_con ul li img{
        width: 17px;
    }

    .content .c_con ul li div{
        width: 60px;
        color: #FFFFFF;
        height: 30px;
        font-size: 18px;
        line-height: 30px;
        display: inline;
        border-radius: 2px;
        padding: 1px 5px;
    }

    .content .c_con ul li .time {
        position: absolute;
        left: 80px;
        line-height: 30px;
    }


    .content .c_con ul li .address {
        position: absolute;
        left: 160px;
        line-height: 30px;
    }

    .content .c_con ul li .type {
        position: absolute;
        right: 10px;
        line-height: 30px;
    }


    .bottom {
        border-top: #8e8e8e solid 1px;
        margin-top: 30px;
        text-align: center;
        position: relative;
        bottom: 0;
    }
    .bottom .qiandao{
        background: #fa6165;
        color: #ffffff;
        font-size: 18px;
        width: 80%;
        height: 35px;
        line-height: 35px;
        border: 0;
        margin-top: 10px;
    }
</style>
<head>
    <title>签到</title>
</head>
<body>
<div class="all">
    <div class="map">

    </div>
    <div class="content">
        <div class="c_title">
            签到记录
        </div>
        <div class="c_con">
            <ul class="c_con_ul">


            </ul>
        </div>
    </div>
    <div class="bottom">
        <button class="qiandao">立即签到</button>
    </div>

</div>

<script>
    $(function(){
        var uid = "";
        var nowDate = new Date();
        var type = $.GetRequest().type;

        $.ajax('/user/getNowLoginUser',{
            dataType:'json',//服务器返回json格式数据
            type:'get',//HTTP请求类型
            success:function(data){
                if(data.flag){
                    uid = data.object.uid;
                    // type=1 2 3 4 5 6 的时候 都是正常的上下班 需要查询考勤时间
                    attendQuery();
                }
            }
        });


        function attendQuery(){
            $.ajax('/attend/seledAttend',{
                dataType:'json',//服务器返回json格式数据
                type:'get',//HTTP请求类型
                data:{
                    uid:uid,
                    attendDate:nowDate.getFullYear()+"-"+(nowDate.getMonth()+1)+"-"+nowDate.getDate()
                },
                success:function(res){
                    if(res.flag){
                        var str_li = "";
                        // 小于等于6就是 正常的上班下班 进行遍历
                        if(type<=6){
                            var attendList = res.data.attendList;
                            for (let i = 0; i < attendList.length; i++) {
                                let atime = attendList[i].atime;
                                let atimestate = attendList[i].atimestate;
                                var typeStyle = '';
                                if(atime==0){
                                    atime = "00:00:00"
                                } else {
                                    atime = formatDate(atime);
                                }
                                if(atimestate!="正常"){
                                    typeStyle = 'style="color:red;"'
                                }
                                if(attendList[i].commute=='1'){
                                    str_li+= '<li type="1" >\n' +
                                        '<div style="background: #fa6165">\n' +
                                        '    <img src="/img/ewx/attend/shangban.png">\n' +
                                        '    <span class="shangban" >上班</span>\n' +
                                        '</div>\n' +
                                        '<span class="time">'+atime+'</span>\n' +
                                        '<span class="address">'+attendList[i].address+'</span>\n' +
                                        '<span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                } else if(attendList[i].commute=='2'){
                                    str_li+=
                                        '<li type="2" >\n' +
                                        '    <div style="background: #2798f5">\n' +
                                        '        <img src="/img/ewx/attend/xiaban.png">\n' +
                                        '        <span class="shangban" >下班</span>\n' +
                                        '    </div>\n' +
                                        '    <span class="time">'+atime+'</span>\n' +
                                        '    <span class="address">'+attendList[i].address+'</span>\n' +
                                        '    <span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                }
                            }
                        }

                        // 7和8是加班
                        if(type==7||type==8){
                            var overTimeWork = res.data.overTimeWork1;
                            for (let i = 0; i < overTimeWork.length; i++) {
                                let atime = overTimeWork[i].atime;
                                let atimestate = overTimeWork[i].atimestate;
                                var typeStyle = '';
                                if(atime==0){
                                    atime = "00:00:00"
                                } else {
                                    atime = formatDate(atime);
                                }
                                if(atimestate!="正常"){
                                    typeStyle = 'style="color:red;"'
                                }
                                if(overTimeWork[i].commute=='1'){
                                    str_li+= '<li type="1" >\n' +
                                        '<div style="background: #fa6165">\n' +
                                        '    <img src="/img/ewx/attend/shangban.png">\n' +
                                        '    <span class="shangban" >上班</span>\n' +
                                        '</div>\n' +
                                        '<span class="time">'+atime+'</span>\n' +
                                        '<span class="address">'+overTimeWork[i].address+'</span>\n' +
                                        '<span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                } else {
                                    str_li+=
                                        '<li type="2" >\n' +
                                        '    <div style="background: #2798f5">\n' +
                                        '        <img src="/img/ewx/attend/xiaban.png">\n' +
                                        '        <span class="shangban" >下班</span>\n' +
                                        '    </div>\n' +
                                        '    <span class="time">'+atime+'</span>\n' +
                                        '    <span class="address">'+overTimeWork[i].address+'</span>\n' +
                                        '    <span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                }
                            }
                        }

                        // 9和10是值班
                        if(type==9||type==10){
                            var dutyWork = res.data.dutyWork;
                            for (let i = 0; i < dutyWork.length; i++) {
                                let atime = dutyWork[i].atime;
                                let atimestate = dutyWork[i].atimestate;
                                var typeStyle = '';
                                if(atime==0){
                                    atime = "00:00:00"
                                } else {
                                    atime = formatDate(atime);
                                }
                                if(atimestate!="正常"){
                                    typeStyle = 'style="color:red;"'
                                }
                                if(dutyWork[i].commute=='1'){
                                    str_li+= '<li type="1" >\n' +
                                        '<div style="background: #fa6165">\n' +
                                        '    <img src="/img/ewx/attend/shangban.png">\n' +
                                        '    <span class="shangban" >上班</span>\n' +
                                        '</div>\n' +
                                        '<span class="time">'+atime+'</span>\n' +
                                        '<span class="address">'+dutyWork[i].address+'</span>\n' +
                                        '<span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                } else {
                                    str_li+=
                                        '<li type="2" >\n' +
                                        '    <div style="background: #2798f5">\n' +
                                        '        <img src="/img/ewx/attend/xiaban.png">\n' +
                                        '        <span class="shangban" >下班</span>\n' +
                                        '    </div>\n' +
                                        '    <span class="time">'+atime+'</span>\n' +
                                        '    <span class="address">'+dutyWork[i].address+'</span>\n' +
                                        '    <span class="type" '+typeStyle+'>'+atimestate+'</span>\n' +
                                        '</li>'
                                }
                            }
                        }


                        $('.c_con_ul').html(str_li);
                    }
                }
            })
        }


        // 点击签到
        $('.qiandao').click(function(){
            $.ajax('/attend/addAttend', {
                dataType: 'json',//服务器返回json格式数据
                type: 'post',//HTTP请求类型
                data: {
                    uid: uid,
                    type: type,
                    address:"企业微信签到",
                    device:"H5",
                    remark:"",
                    phoneId:"",
                    attendDate: nowDate.getFullYear() + "-" + (nowDate.getMonth() + 1) + "-" + nowDate.getDate()
                },
                success: function (res) {
                    if(res.flag){
                        alert("签到成功");
                        attendQuery();
                    }else {
                        alert(res.msg);
                    }
                }
            })
        });











        // 格式化返回时间
        function formatDate(time) {
            console.log(time);
            var now = new Date(time*1000);
            var year=now.getFullYear();
            var month=now.getMonth()+1;
            var date=now.getDate();
            var hour=now.getHours();
            var minute=now.getMinutes();
            var second=now.getSeconds();
            if(minute<10){
                minute="0"+minute;
            }
            if(second<10){
                second="0"+second;
            }
            return hour+":"+minute+":"+second;
        }




    })
</script>
</body>
</html>
